<template>
  <div class="container">
    <div class="title">
      <el-checkbox class="all">全选</el-checkbox>
      <el-button>批量下载</el-button>
    </div>

    <ul>
      <li>
        <el-checkbox></el-checkbox>
        <div class="img"></div>
        <div class="text">
          <p>协同科研创新基础支撑平台使用文档</p>
          <p>网络数据&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2022-04-11 14:23</p>
        </div>
        <el-button class="download" icon="el-icon-download"></el-button>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Train",
};
</script>

<style scoped>
.img {
  width: 151px;
  height: 109px;
  background-color: blue;
  margin: 20px;
}
li {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
  margin: 10px;
}
.text {
  flex: 1;
}
.el-checkbox {
  margin: 10px;
}
p {
  margin: 10px;
}
.download {
  border: none;
  font-size: 40px;
  color:#157dff;
}
.title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.all {
  flex: 1;
}
</style>